let sno = document.getElementById('sno'); // 学号
let password1 = document.getElementById('password1');
let password2 = document.getElementById('password2');
let flag1 = false;
let flag2 = false;
let flag3 = false;
let flag4 = false;
let submit = document.getElementById('submit');
const HEIGHT = '18px';
/*
	功能：设置元素样式
*/
function setStyle(element, visibility, background, innerText, color, borderColor) {
	if(visibility) {
		setVisibile(element);
	} else {
		setHiden(element);
	}
	if(background) {
		element.style.background = background;
	}
	if(innerText) {
		element.innerText = innerText;
	}
	if(color) {
		element.style.color = color;
	}
	if(borderColor) {
		element.style.borderColor = borderColor;
	}
}
/*
	功能：设置元素隐藏
*/
function setHiden(element) {
	element.style.height = 0;
	element.style.lineHeight = 0;
	element.style.float = 'left';
	if(element.id != 'tip1' && element.id != 'tip2' && element.id != 'tip3' ) {
		element.innerText = '';
	}
}
/*
	功能：设置元素显示
*/
function setVisibile(element, innerText) {
	element.style.display = 'block';
	element.style.height = HEIGHT;
	element.style.lineHeight = HEIGHT;
	element.style.clear = 'both';
	let className = element.parentNode.className;
	if(className.indexOf('clearfix') == -1) {
		element.parentNode.className = className + ' clearfix';
	}
	if(innerText) {
		element.innerText = innerText;
	}	
}
/*
	功能：检查密码是否满足条件
	参数：密码字符串
	返回值：对象
*/
function checkPassword(password) {
	let regExp1 = /\s/;
	let regExp3_1 = /\d/;
	let regExp3_2 = /[a-zA-Z]/;
	let regExp3_3 = /[\W_]/;
	let obj = {
		condition1: false,
		condition2: false,
		condition3: false
	}
	// 条件1
	if(password == null || password.length === 0) {
		obj.condition1 = true;
	} else if(!regExp1.test(password)) {
		obj.condition1 = true;
	}

	// 条件2
	let length = password.length; 
	if(length >=8 && length <=16) {
		obj.condition2 = true;
	}

	// 条件3
	let i = 0;
	if(regExp3_1.test(password)) {
		i++;
	}
	if(regExp3_2.test(password)) {
		i++;
	}
	// 保证不能有空格
	if(regExp3_3.test(password) && !regExp1.test(password)) {

		i++;
	}
	if(i >= 2) {
		obj.condition3 = true;
	}
	return obj;
}
/*
	功能：作为password1的失去焦点时触发的事件
*/
function password1Blur() {
	let value = this.value;
	let formTip = this.parentNode.nextElementSibling.children[0];
	let tip1 = document.getElementById('tip1');
	let tip2 = document.getElementById('tip2');
	let tip3 = document.getElementById('tip3');
	let outTip = formTip.nextElementSibling.children[0];
	setHiden(tip1);
	setHiden(tip2);
	setHiden(tip3);
	tip1.parentNode.style.marginTop = '-10px';
	let correct = this.nextElementSibling;
	if(value == null || value.length == 0) {
		flag2 = false;
		correct.style.background = '';
		this.style.borderColor = '#ff5b5b';
		setTimeout(() => {
			setStyle(outTip, true, 
			'url(/images/tip_icon_red.png) no-repeat 0 1px',
			'密码不能为空',
			'#f00',
			null);
		}, 10);
	} else {
		flag2 = false;
		correct.style.background = '';
		let obj = checkPassword(value);
		if(!obj.condition1) {
			this.style.borderColor = '#ff5b5b';
			setTimeout(() => {
				setStyle(outTip, true, 
				'url(/images/tip_icon_red.png) no-repeat 0 1px',
				'不能包括空格',
				'#f00',
				null);
			}, 10);
		} else if(!obj.condition2) {
			flag2 = false;
			correct.style.background = '';
			this.style.borderColor = '#ff5b5b';
			setTimeout(() => {
				setStyle(outTip, true, 
				'url(/images/tip_icon_red.png) no-repeat 0 1px',
				'长度为8-16个字符',
				'#f00',
				null);
			}, 10);
		} else if(!obj.condition3) {
			flag2 = false;
			correct.style.background = '';
			this.style.borderColor = '#ff5b5b';
			setTimeout(() => {
				setStyle(outTip, true, 
				'url(/images/tip_icon_red.png) no-repeat 0 1px',
				'必须包含字母、数字、符号中至少2种',
				'#f00',
				null);
			}, 10);
		} else {
			// 都符合条件时
			flag2 = true;
			this.style.borderColor = '#ccc';
			correct.style.background = 'url(/images/correct_icon2.png) no-repeat 10px 10px';
		}
	}
}
/*
	功能：作为password2的失去焦点时触发的事件
*/
function password2Blur() {
	let value = this.value;
	let formTip = this.parentNode.nextElementSibling;
	let tip = formTip.children[0];
	let correct = this.nextElementSibling;
	if(value == null || value.length === 0) {
		flag3 = false;
		setStyle(tip, true,
			'url(/images/tip_icon_red.png) no-repeat 0 1px', 
			'密码不可以为空',
			'#f00',
			null);
		this.style.borderColor = '#ff5b5b';
		correct.style.background = '';
		return;
	}
	if(value == password1.value) {
		// 两次输入的密码相同
		flag3 = true;
		correct.style.background = 'url(/images/correct_icon2.png) no-repeat 10px 10px';
		setHiden(tip);
		this.style.borderColor = '#ccc';
	} else {
		flag3 = false;
		correct.style.background = '';
		setStyle(tip, true,
			'url(/images/tip_icon_red.png) no-repeat 0px 1px', 
			'两次输入的密码不一样',
			'#f00',
			null);
		this.style.borderColor = '#ff5b5b';
	}

}
/*
	功能：表单提交
*/
let agreement = document.getElementById('agreement');
let label = agreement.children[0];
function checkForm() {
	// 检查用户有没有同意服务条款
	let agreeImg = label.children[0];
	if(agreeImg.style.display == 'none') {
		label.parentNode.children[4].style.display = 'block';
		return false;
	}
	sno.focus();
	sno.blur();
	password1.focus();
	password1.blur();
	password2.focus();
	password2.blur();
	verifyCode.focus();
	verifyCode.blur();
	if(flag1 && flag2 && flag3 && flag4) {
		let password = document.getElementById('md5Pwd');
		let errorTip = document.getElementById('errorTip');
		errorTip.style.display = 'none';
		// 密码加密
		password.value = hex_md5(password1.value);
		// 显示等待图片
		let mask = document.getElementById('mask');
		mask.style.display = 'block';
		mask.innerHTML = `<div class="mask-wrap" style="position: absolute; top: 50%; left: 50%; margin-top: -45px;margin-left: -45px;width: 90px;height: 90px;background: url(/images/loading2.gif) no-repeat;background-size: 90px;">
						  </div>`;
		ajax({
			type: 'POST',
			url: '/user/regist',
			async: true,
			data:{
				number: sno.value,
				password: password.value,
				verifyCode: verifyCode.value,
				cf: cf.value,
				pmr: cf.nextElementSibling.value,
				agreement: 1
			},
			success: function(xhr) {
				let arg = JSON.parse(xhr.responseText);
				removeAllChildren(mask);
				if(arg.code == 200 && arg.message == 'success') {
					mask.innerHTML = `<div class="mask-wrap" style="position: absolute; top: 50%; left: 50%; margin-top: -76.5px;margin-left: -209px;width: 418px;background-color: #fff;border-radius: 4px;">
										<div class="mask-h clearfix">
											<span style="float: left;width: 32px;height: 32px;background: url(/images/correct_icon3.png) no-repeat;margin-top: 10px;margin-left: 10px;"></span>
											<span style="float: left;height: 53px;line-height: 53px;padding-left: 10px;font-size: 14px;">注册成功</span>
											<span style="float: right;width: 24px;height: 24px;background: url(/images/x_icon.png) no-repeat;cursor: pointer;margin-top: 9px;margin-right: 8px;" title="关闭面板" ></span>
										</div>
										<div class="mask-content" style="padding: 5px 20px;font-size: 14px;">请立即到个人信息页面完善您的资料，以免影响到正常交易。</div>
										<div class="mask-b clearfix" style="margin: 25px 0 17px;">
											<button class="mask-button mask-button-cancel" style="float: right; margin-right: 29px;">关闭</button>
											<button class="mask-button" style="float: right; margin-right: 12px;">确定</button>
										</div>
						  			</div>`;
					let maskH = mask.querySelector('.mask-h');
					maskH.children[2].onclick = function() {
						// 顶部关闭icon
						location.replace('/page/user/login.html');
						return;
					}
					let maskB = mask.querySelector('.mask-b');
					maskB.children[0].onclick = function() {
						// 关闭 
						location.replace('/page/user/regist.html'); // 刷新页面
						return;
					}
					maskB.children[1].onclick = function() {
						// 确定
						location.replace('/page/user/login.html');
						return;
					};
				} else if(arg.code == 3000) {
					// 用户名已被注册
					let snoValue = sno.value;
					// 刷新页面，清空值
					location.replace('/page/user/regist.html?sno=' + sno.value + '&msg=' + arg.message); 
					return;
				} else {
					// 非法注册3001或其他
					location.replace('/page/error500.html');
					return;
				}
			}	
		});
		return false;
	} else {
		return false;
	}
}
/* 学号注册事件 start */
sno.onfocus = function() {
	let value = this.value;
	let formTip = this.parentNode.nextElementSibling;
	let tip = formTip.children[0];
	if(value == null || value.trim().length === 0) {
		setStyle(tip, true, 
			'url(/images/tip_icon_blue.png) no-repeat 0 1px', 
			'学号代表了您的身份，请认真填写',
			'#3c3c3c',
			null);
		this.style.borderColor = '#579cf5';
	} else {
		setHiden(tip);
		this.style.borderColor = '#579cf5';
	}
}
sno.onblur = function() {
	let value = this.value;
	let formTip = this.parentNode.nextElementSibling;
	let tip = formTip.children[0];
	let correct = this.nextElementSibling;
	if(value == null || value.length === 0) {
		flag1 = false;
		setStyle(tip, true,
			'url(/images/tip_icon_red.png) no-repeat 0 1px', 
			'学号不可以为空',
			'#f00',
			null);
		this.style.borderColor = '#ff5b5b';
		correct.style.background = '';
		return;
	}
	let regExp = /^[1-9]\d{12}$/; // 13位学号，第一位不能为0
	if(regExp.test(value)) {
		// 学号格式正确
		flag1 = true;
		correct.style.background = 'url(/images/correct_icon2.png) no-repeat 10px 10px';
		setHiden(tip);
		this.style.borderColor = '#ccc';
	} else {
		flag1 = false;
		correct.style.background = '';
		setStyle(tip, true,
			'url(/images/tip_icon_red.png) no-repeat 0px 1px', 
			'格式不正确',
			'#f00',
			null);
		this.style.borderColor = '#ff5b5b';
	}
}
sno.onkeyup = function() {
	let value = this.value;
	let formTip = this.parentNode.nextElementSibling;
	let tip = formTip.children[0];
	let correct = this.nextElementSibling;
	if(value == null || value.trim().length === 0) {
		this.style.borderColor = '#579cf5';
		correct.style.background = '';
		setStyle(tip, true,
			'url(/images/tip_icon_blue.png) no-repeat 0 1px', 
			'学号代表了您的身份，请认真填写',
			'#3c3c3c',
			null);
	} 
}
/* 学号注册事件 end */

/* 第一个密码注册事件 start */
password1.onfocus = function() {
	let value = this.value;
	let tip1 = document.getElementById('tip1');
	let tip2 = document.getElementById('tip2');
	let tip3 = document.getElementById('tip3');
	let obj = checkPassword(value);
	if(obj.condition1) {
		tip1.style.background = 'url(/images/correct_icon1.png) no-repeat 0 1px';
	} else {
		tip1.style.background = 'url(/images/tip_icon_blue.png) no-repeat 0 1px';
	}
	if(obj.condition2) {
		tip2.style.background = 'url(/images/correct_icon1.png) no-repeat 0 1px';
	} else {
		tip2.style.background = 'url(/images/tip_icon_blue.png) no-repeat 0 1px';
	}
	if(obj.condition3) {
		tip3.style.background = 'url(/images/correct_icon1.png) no-repeat 0 1px';
	} else {
		tip3.style.background = 'url(/images/tip_icon_blue.png) no-repeat 0 1px';
	}
	let formTip = this.parentNode.nextElementSibling.children[0];
	let outTip = formTip.nextElementSibling.children[0];
	setVisibile(tip1);
	setVisibile(tip2);
	setVisibile(tip3);
	tip1.parentNode.style.marginTop = '';
	setHiden(outTip);
}
password1.oninput = function() {
	let value = this.value;
	let eye = document.getElementById('eye1');
	if(value != null && value.length > 0 ) {
		// 有内容时显示eye
		eye.style.display = 'block';
		let _this = this;
		eye.onmousedown = function() {
			this.src = '/images/eye-open.png';
			_this.type = 'text';
			_this.onblur = function() {
  				var self = this;
  				setTimeout(() => { 
  					self.focus(); 
  				}, 10);
			}
			eye.onmouseleave = function() {
				this.src = '/images/eye-close.png';
				_this.type = 'password';
				_this.onblur = password1Blur;
			}
		}
		eye.onmouseup = function() {
			this.src = '/images/eye-close.png';
			_this.type = 'password';
			_this.onblur = password1Blur;
		}
	} else {
		// 无内容时隐藏eye
		eye.style.display = 'none';
		eye.src = '/images/eye-close.png';
		this.type = 'password';
		eye.onmousedown = null;
		eye.onmouseup = null;
	}
}
password1.onblur = password1Blur;
password1.onkeyup = function() {
	let value = this.value;
	let tip1 = document.getElementById('tip1');
	let tip2 = document.getElementById('tip2');
	let tip3 = document.getElementById('tip3');
	let obj = checkPassword(value);
	let correct = this.nextElementSibling;
	if(obj.condition1) {
		tip1.style.background = 'url(/images/correct_icon1.png) no-repeat 0 1px';
	} else {
		tip1.style.background = 'url(/images/tip_icon_blue.png) no-repeat 0 1px';
		correct.style.background = '';
	}
	if(obj.condition2) {
		tip2.style.background = 'url(/images/correct_icon1.png) no-repeat 0 1px';
	} else {
		tip2.style.background = 'url(/images/tip_icon_blue.png) no-repeat 0 1px';
		correct.style.background = '';
	}
	if(obj.condition3) {
		tip3.style.background = 'url(/images/correct_icon1.png) no-repeat 0 1px';
	} else {
		tip3.style.background = 'url(/images/tip_icon_blue.png) no-repeat 0 1px';
		correct.style.background = '';
	}
}
/* 第一个密码注册事件 end */

/* 第二个密码注册事件 start*/
password2.onfocus = function() {
	let value = this.value;
	let formTip = this.parentNode.nextElementSibling;
	let tip = formTip.children[0];
	if(value == null || value.trim().length === 0) {
		setStyle(tip, true, 
			'url(/images/tip_icon_blue.png) no-repeat 0 1px', 
			'请再次输入密码',
			'#3c3c3c',
			null);
		this.style.borderColor = '#579cf5';
	} else {
		setHiden(tip);
		this.style.borderColor = '#579cf5';
	}
}
password2.oninput = function() {
	let value = this.value;
	let eye = document.getElementById('eye2');
	if(value != null && value.length > 0 ) {
		// 有内容时显示eye
		eye.style.display = 'block';
		let _this = this;
		eye.onmousedown = function() {
			this.src = '/images/eye-open.png';
			_this.type = 'text';
			_this.onblur = function() {
  				var self = this;
  				setTimeout(() => { 
  					self.focus(); 
  				}, 10);
			}
			eye.onmouseleave = function() {
				this.src = '/images/eye-close.png';
				_this.type = 'password';
				_this.onblur = password2Blur;
			}
		}
		eye.onmouseup = function() {
			this.src = '/images/eye-close.png';
			_this.type = 'password';
			_this.onblur = password1Blur;
		}
	} else {
		// 无内容时隐藏eye
		eye.style.display = 'none';
		eye.src = '/images/eye-close.png';
		this.type = 'password';
		eye.onmousedown = null;
		eye.onmouseup = null;
	}
}
password2.onblur = password2Blur;
password2.onkeyup = function() {
	let value = this.value;
	let formTip = this.parentNode.nextElementSibling;
	let tip = formTip.children[0];
	let correct = this.nextElementSibling;
	if(value == null || value.trim().length === 0) {
		this.style.borderColor = '#579cf5';
		correct.style.background = '';
		setStyle(tip, true,
			'url(/images/tip_icon_blue.png) no-repeat 0 1px', 
			'请再次输入密码',
			'#3c3c3c',
			null);
	} 
}
/* 第二个密码注册事件 end*/
/* 验证码事件 */
let verifyCode = document.getElementById('verifyCode');
verifyCode.onfocus = function() {
	getVC();
	let value = this.value;
	let formTip = this.parentNode.nextElementSibling;
	let tip = formTip.children[0];
	if(value == null || value.trim().length === 0) {
		setStyle(tip, true, 
			'url(/images/tip_icon_blue.png) no-repeat 0 1px', 
			'看不清可以换一张',
			'#3c3c3c',
			null);
		this.style.borderColor = '#579cf5';
	} else {
		setHiden(tip);
		this.style.borderColor = '#579cf5';
	}
}
verifyCode.onblur = function() {
	let value = this.value;
	let formTip = this.parentNode.nextElementSibling;
	let tip = formTip.children[0];
	let changeImg = this.nextElementSibling.nextElementSibling;
	let correct = changeImg.nextElementSibling;
	if(value == null || value.length === 0) {
		flag4 = false;
		setStyle(tip, true,
			'url(/images/tip_icon_red.png) no-repeat 0 1px', 
			'验证码不可以为空',
			'#f00',
			null);
		this.style.borderColor = '#ff5b5b';
		changeImg.style.display = 'inline-block';
		correct.style.display = 'none';
		correct.style.background = '';
		return;
	}
	if(value.toUpperCase() == vc.toUpperCase()) {
		// 验证码正确
		flag4 = true;
		changeImg.style.display = 'none';
		correct.style.display = 'block';
		correct.style.background = 'url(/images/correct_icon2.png) no-repeat 10px 10px';
		setHiden(tip);
		this.style.borderColor = '#ccc';
	} else {
		flag4 = false;
		changeImg.style.display = 'inline-block';
		correct.style.display = 'none';
		correct.style.background = '';
		setStyle(tip, true,
			'url(/images/tip_icon_red.png) no-repeat 0px 1px', 
			'验证码不正确',
			'#f00',
			null);
		this.style.borderColor = '#ff5b5b';
	}
}
verifyCode.onkeyup = function() {
	let value = this.value;
	let formTip = this.parentNode.nextElementSibling;
	let tip = formTip.children[0];
	let changeImg = this.nextElementSibling.nextElementSibling;
	let correct = changeImg.nextElementSibling;
	if(value == null || value.trim().length == 0) {
		this.style.borderColor = '#579cf5';
		correct.style.background = '';
		setStyle(tip, true,
			'url(/images/tip_icon_blue.png) no-repeat 0 1px', 
			'看不清可以换一张',
			'#3c3c3c',
			null);
	} else {
		setHiden(tip);
	}
	if(value.toUpperCase() == vc.toUpperCase()) {
		// 验证码正确
		changeImg.style.display = 'none';
		correct.style.display = 'block';
		correct.style.background = 'url(/images/correct_icon2.png) no-repeat 10px 10px';
		setHiden(tip);
		this.style.borderColor = '#ccc';
	} else {
		changeImg.style.display = 'inline-block';
		correct.style.display = 'none';
		correct.style.background = '';
	}
}









/* 用户条例 */
label.onclick = function() {
	let agreeImg = this.children[0];
	let disagreeImg = this.children[1];
	if(agreeImg.style.display == 'inline-block') {
		agreeImg.style.display = 'none';
		disagreeImg.style.display = 'inline-block';
	} else {
		agreeImg.style.display = 'inline-block';
		disagreeImg.style.display = 'none';
		let agreementTip = this.parentNode.children[4];
		if(agreementTip.style.display == 'block') {
			agreementTip.style.display = 'none';
		}
	
	}
}
let arrowDown = label.nextElementSibling;
let arrowUp = arrowDown.nextElementSibling;
let agreementContent = arrowUp.nextElementSibling;
arrowDown.onclick = function() {
	agreementContent.style.visibility = 'visible';
	agreementContent.style.opacity = 1;
	this.style.display = 'none';
	arrowUp.style.display = 'inline-block';
}
arrowUp.onclick = function() {
	agreementContent.style.visibility = 'hidden';
	agreementContent.style.opacity = 0;
	this.style.display = 'none';
	arrowDown.style.display = 'inline-block';
}